<html><head><title>README</title><link href="https://raw.github.com/pmuir/github-flavored-markdown/gh-pages/shared/css/documentation.css" rel="stylesheet"></link><link href="https://raw.github.com/github/github-flavored-markdown/gh-pages/shared/css/pygments.css" rel="stylesheet"></link></head><body><h1 id="toc_0">kitchensink-rf: Example Using Multiple Java EE 6 Technologies with RichFaces</h1>

<p>Author: Pete Muir</p>

<h2 id="toc_1">What is it?</h2>

<p>This is your project! It is a sample, deployable Maven 3 project to help you get your foot in the door developing with Java EE 6 on JBoss Enterprise Application Platform 6 or JBoss AS 7. </p>

<p>This project is setup to allow you to create a compliant Java EE 6 application using JSF 2.0, CDI 1.0, EJB 3.1, JPA 2.0 and Bean Validation 1.0. It includes a persistence unit and some sample persistence and transaction code to introduce you to database access in enterprise Java. </p>

<p>This application builds on top of the standard JSF approach by incorporating the RichFaces project to provide a set of components, allowing for a rich user experience.  RichFaces builds on top of the JSF standard and is a fully portable solution compatible with all JSF implementations.</p>

<p>The <code>kitchensink</code> quickstart is built using vanilla JSF for its front end. The <code>kitchensink-rf</code> quickstart builds on top of the JSF user interface, augmenting it with RichFaces JSF components and capabilities.  </p>

<p>Some key points to make note of while running the application:</p>

<ul>
<li><p>Ajax push: This application makes use of Ajax push. When a member is created in one browser, the member list is updated in <strong>all</strong> open browsers.</p>

<p>Try this yourself. Open two different browsers, create a new member in one browser and watch for the list to be updated in both browsers.</p></li>
<li><p>Ajax: All page updates are made with an Ajax call, increasing the page responsiveness and leading to a more native <strong>feeling</strong> application.</p></li>
<li><p>Client-side validation: By simply nesting a <code>&lt;rich:validator /&gt;</code> tag in the input elements, we wire them with RichFaces client-side validation capabilities. The inputs are validated locally using javascript, without requiring a round-trip to the server.</p></li>
<li><p>Popups: Click the <code>view</code> link next to a member in the member list to view a popup with the member details. To close the popup, click the <code>X</code> in the top right-hand corner, or click anywhere on the background mask.</p></li>
<li><p>Mobile support: View the application from a webkit powered browser on a mobile device to try out the mobile version of the application. Alternatively, view the mobile version on your desktop by navigating to the url:  <a href="http://localhost:8080/agape/mobile/">http://localhost:8080/agape/mobile/</a></p></li>
</ul>

<p>Specific changes to the "vanilla" kitchensink desktop view:</p>

<ul>
    <li><p>Ajax push: This application makes use of Ajax push. When a member is created in one browser, the member list is updated in <strong>all</strong> open browsers.</p></li>
    <li><p>rich:validator for client-side-validation</p></li>
    <li><p>a4j:commandButton to submit a form via ajax</p></li>
    <li><p>rich:collapsiblePanel around the members list - click to expand/collapse</p></li>
    <li><p>rich:popupPanel via the "view" link in the table for showing member details with a popup</p></li>
    <li><p>rich:panel to get a styled panel header</p></li>
    <li><p>rich:messages to get styled error messages (with icons)</p></li>
    <li><p>rich:dataTable for styled column headers</p></li>
    <li><p>activated the "classic" skin in the web.xml - (styles vanilla JSF components too)</p></li>
    <li><p>leveraged AS 7 modules for RF dependencies via the "Dependencies" manifest.mf entry</p></li>
</ul><p>Upgrades made to enable the mobile view:</p>

<ul>
    <li><p>enabled resourceLoadingOptimisation (packaging and minification)</p></li>
    <li><p>introduced the RichFaces mobile compatibility CSS file</p></li>
    <li><p>device detection to automatically choose between the desktop and mobile templates</p></li>
    <li><p>split the app into multiple screens for mobile</p></li>
    <li><p>single page programming model w/ CSS3 page transitions activating the device GPU</p></li>
    <li><p>Note: mobile still has a4j:push integration</p></li>
</ul>

<h2 id="toc_2">System requirements</h2>

<p>All you need to build this project is Java 6.0 (Java SDK 1.6) or better, Maven 3.0 or better.</p>

<p>The application this project produces is designed to be run on JBoss Enterprise Application Platform 6 or JBoss AS 7. </p>

<h2 id="toc_3">Configure Maven</h2>

<p>If you have not yet done so, you must <a href="../README.html#mavenconfiguration">Configure Maven</a> before testing the quickstarts.</p>

<h2 id="toc_4">Start JBoss Enterprise Application Platform 6 or JBoss AS 7 with the Web Profile</h2>

<ol>
<li>Open a command line and navigate to the root of the JBoss server directory.</li>
<li><p>The following shows the command line to start the server with the web profile:</p>
<div class="highlight"><pre><span class="n">For</span> <span class="n">Linux</span><span class="p">:</span>   <span class="n">JBOSS_HOME</span><span class="o">/</span><span class="n">bin</span><span class="o">/</span><span class="n">standalone</span><span class="p">.</span><span class="n">sh</span>
<span class="n">For</span> <span class="n">Windows</span><span class="p">:</span> <span class="n">JBOSS_HOME</span><span class="o">\</span><span class="n">bin</span><span class="o">\</span><span class="n">standalone</span><span class="p">.</span><span class="n">bat</span>
</pre>
</div></li>
</ol>

<h2 id="toc_5">Build and Deploy the Quickstart</h2>

<p><em>NOTE: The following build command assumes you have configured your Maven user settings. If you have not, you must include Maven setting arguments on the command line. See <a href="../README.html#buildanddeploy">Build and Deploy the Quickstarts</a> for complete instructions and additional options.</em></p>

<ol>
<li>Make sure you have started the JBoss Server as described above.</li>
<li>Open a command line and navigate to the root directory of this quickstart.</li>
<li><p>Type this command to build and deploy the archive:</p>
<div class="highlight"><pre><span class="n">mvn</span> <span class="n">clean</span> <span class="n">package</span> <span class="n">jboss</span><span class="o">-</span><span class="n">as</span><span class="p">:</span><span class="n">deploy</span>
</pre>
</div></li>
<li><p>This will deploy <code>target/agape.war</code> to the running instance of the server.</p></li>
</ol>

<h2 id="toc_6">Access the application </h2>

<p>The application will be running at the following URL: <a href="http://localhost:8080/agape/">http://localhost:8080/agape/</a>.</p>

<h2 id="toc_7">Undeploy the Archive</h2>

<ol>
<li>Make sure you have started the JBoss Server as described above.</li>
<li>Open a command line and navigate to the root directory of this quickstart.</li>
<li><p>When you are finished testing, type this command to undeploy the archive:</p>
<div class="highlight"><pre><span class="n">mvn</span> <span class="n">jboss</span><span class="o">-</span><span class="n">as</span><span class="p">:</span><span class="n">undeploy</span>
</pre>
</div></li>
</ol>

<h2 id="toc_8">Run the Arquillian Tests </h2>

<p>This quickstart provides Arquillian tests. By default, these tests are configured to be skipped as Arquillian tests require the use of a container. </p>

<p><em>NOTE: The following commands assume you have configured your Maven user settings. If you have not, you must include Maven setting arguments on the command line. See <a href="../README.html#arquilliantests">Run the Arquillian Tests</a> for complete instructions and additional options.</em></p>

<ol>
<li>Make sure you have started the JBoss Server as described above.</li>
<li>Open a command line and navigate to the root directory of this quickstart.</li>
<li><p>Type the following command to run the test goal with the following profile activated:</p>
<div class="highlight"><pre><span class="n">mvn</span> <span class="n">clean</span> <span class="n">test</span> <span class="o">-</span><span class="n">Parq</span><span class="o">-</span><span class="n">jbossas</span><span class="o">-</span><span class="n">remote</span> 
</pre>
</div></li>
</ol>

<h2 id="toc_9">Run the Quickstart in JBoss Developer Studio or Eclipse</h2>

<p>You can also start the server and deploy the quickstarts from Eclipse using JBoss tools. For more information, see <a href="../README.html#useeclipse">Use JBoss Developer Studio or Eclipse to Run the Quickstarts</a> </p>

<h2 id="toc_10">Debug the Application</h2>

<p>If you want to debug the source code or look at the Javadocs of any library in the project, run either of the following commands to pull them into your local repository. The IDE should then detect them.</p>
<div class="highlight"><pre><span class="n">mvn</span> <span class="n">dependency</span><span class="p">:</span><span class="n">sources</span>
<span class="n">mvn</span> <span class="n">dependency</span><span class="p">:</span><span class="n">resolve</span> <span class="o">-</span><span class="n">Dclassifier</span><span class="p">=</span><span class="n">javadoc</span>
</pre>
</div>
</body></html>
